import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15

ApplicationWindow {
    id: window
    width: 1673
    height: 746
    visible: true
    title: "汽车仪表盘"
    color: "#0a0a0a"

    Rectangle {
        anchors.fill: parent
        color: "#0a0a0a"

        // 主仪表盘区域
        Item {
            id: dashboardArea
            anchors.fill: parent
            anchors.margins: 20

            // 左侧转速表
            CircularGauge {
                id: rpmGauge
                anchors.right: centralInfo.left
                anchors.rightMargin: 40
                anchors.verticalCenter: parent.verticalCenter
                width: 300
                height: 300

                minValue: 0
                maxValue: 7
                value: carData.rpm / 1000

                title: "TACHO"
                unit: "rpm ×1000"
                centerValue: Math.round(carData.rpm / 1000)

                warningZone: true
                warningThreshold: 5.5
            }

            // 右侧速度表
            CircularGauge {
                id: speedGauge
                anchors.left: centralInfo.right
                anchors.leftMargin: 40
                anchors.verticalCenter: parent.verticalCenter
                width: 300
                height: 300

                minValue: 0
                maxValue: 180
                value: carData.speed

                title: "SPEED"
                unit: "km/h"
                centerValue: carData.speed

                warningZone: true
                warningThreshold: 120
            }

            // 中央信息区
            Rectangle {
                id: centralInfo
                anchors.centerIn: parent
                width: 400
                height: 300
                color: "#1a1a1a"
                border.color: "#333"
                border.width: 2
                radius: 10

                MouseArea {
                    anchors.fill: parent
                    onClicked: detailView.visible = true
                }

                // 顶部信息行
                Row {
                    id: topInfoRow
                    anchors.top: parent.top
                    anchors.left: parent.left
                    anchors.right: parent.right
                    anchors.margins: 15
                    height: 50
                    spacing: 15

                    // 远光灯状态
                    Rectangle {
                        width: 40
                        height: 40
                        color: "#222222"
                        radius: 20
                        border.color: carData.headlightsOn ? "#FFC107" : "#444444"
                        border.width: 2

                        Image {
                            anchors.centerIn: parent
                            source: "qrc:/images/远光灯.svg"
                            width: 24
                            height: 24
                            opacity: carData.headlightsOn ? 1.0 : 0.4
                            fillMode: Image.PreserveAspectFit
                        }
                    }

                    Item { width: 10; height: 1 }

                    // 外部温度
                    Text {
                        anchors.verticalCenter: parent.verticalCenter
                        text: carData.outsideTemp.toFixed(1) + "°C"
                        color: "#00BCD4"
                        font.pixelSize: 22
                        font.bold: true
                    }

                    Item { width: 80; height: 1 }

                    // 当前时间
                    Text {
                        anchors.verticalCenter: parent.verticalCenter
                        text: carData.currentTime
                        color: "#00BCD4"
                        font.pixelSize: 22
                        font.bold: true
                    }
                }

                // 中央状态信息
                Rectangle {
                    id: centralStatusInfo
                    anchors.top: topInfoRow.bottom
                    anchors.left: parent.left
                    anchors.right: parent.right
                    anchors.margins: 15
                    anchors.topMargin: 10
                    height: 130
                    color: "#000000"
                    radius: 5
                    border.color: "#333333"
                    border.width: 1

                    Text {
                        anchors.centerIn: parent
                        text: carData.statusMessage
                        color: "white"
                        font.pixelSize: 20
                        font.bold: true
                        horizontalAlignment: Text.AlignHCenter
                        wrapMode: Text.WordWrap
                        width: parent.width - 20
                    }
                }

                // 状态指示器区域
                Row {
                    id: statusIndicators
                    anchors.top: centralStatusInfo.bottom
                    anchors.horizontalCenter: parent.horizontalCenter
                    anchors.topMargin: 10
                    height: 40
                    width: parent.width - 30
                    spacing: 0
                    
                    // 左侧间隔
                    Item { width: parent.width * 0.15; height: 1 }

                    // 发动机状态图标
                    Rectangle {
                        id: engineCoolIcon
                        anchors.verticalCenter: parent.verticalCenter
                        width: 30
                        height: 30
                        color: "#222222"
                        border.color: carData.engineRunning ? "#4CAF50" : "#f44336"
                        border.width: 3
                        radius: 15

                        Item {
                            anchors.centerIn: parent
                            width: 24
                            height: 24

                            // 绿色发动机图标
                            Image {
                                anchors.fill: parent
                                source: "qrc:/images/发动机灯.svg"
                                fillMode: Image.PreserveAspectFit
                                visible: carData.engineRunning
                                opacity: 1.0
                            }
                            
                            // 红色发动机图标
                            Image {
                                anchors.fill: parent
                                source: "qrc:/images/发动机灯.svg"
                                fillMode: Image.PreserveAspectFit
                                visible: !carData.engineRunning
                                opacity: 0.8
                            }
                        }
                    }
                    
                    // 第一个间隔
                    Item { width: parent.width * 0.2; height: 1 }

                    // 中央图标（可以添加其他状态指示）
                    Rectangle {
                        id: centerStatusIcon
                        anchors.verticalCenter: parent.verticalCenter
                        width: 30
                        height: 30
                        color: "#222222"
                        border.color: carData.seatbeltWarning ? "#f44336" : "#4CAF50"
                        border.width: 3
                        radius: 15

                        Image {
                            anchors.centerIn: parent
                            source: "qrc:/images/安全带灯.svg"
                            width: 24
                            height: 24
                            fillMode: Image.PreserveAspectFit
                        }
                        
                        // 当安全带警告激活时显示
                        visible: true
                    }
                    
                    // 第二个间隔
                    Item { width: parent.width * 0.2; height: 1 }

                    // 手刹状态图标
                    Rectangle {
                        id: handbrakeStatusIcon
                        anchors.verticalCenter: parent.verticalCenter
                        width: 30
                        height: 30
                        color: "#222222"
                        border.color: carData.handbrakeOn ? "#f44336" : "#4CAF50"
                        border.width: 3
                        radius: 15

                        Item {
                            anchors.centerIn: parent
                            width: 24
                            height: 24

                            // 红色手刹图标（拉起）
                            Image {
                                anchors.fill: parent
                                source: "qrc:/images/制动警告.svg"
                                fillMode: Image.PreserveAspectFit
                                visible: carData.handbrakeOn
                            }
                            
                            // 绿色手刹图标（松开）
                            Image {
                                anchors.fill: parent
                                source: "qrc:/images/制动警告.svg"
                                fillMode: Image.PreserveAspectFit
                                visible: !carData.handbrakeOn
                            }
                        }
                    }
                    
                    // 右侧间隔
                    Item { width: parent.width * 0.15; height: 1 }
                }

                // 底部状态栏
                Item {
                    id: bottomStatusBar
                    anchors.top: statusIndicators.bottom
                    anchors.left: parent.left
                    anchors.right: parent.right
                    anchors.bottom: parent.bottom
                    anchors.margins: 15
                    anchors.topMargin: 10

                    // 左侧：总里程和安全带
                    Column {
                        anchors.left: parent.left
                        anchors.verticalCenter: parent.verticalCenter
                        spacing: 5

                        Text {
                            text: carData.totalKm + " km"
                            color: "#00BCD4"
                            font.pixelSize: 20
                            font.bold: true
                        }

                    }

                    // 右侧：续航和燃油
                    Column {
                        anchors.right: parent.right
                        anchors.verticalCenter: parent.verticalCenter
                        spacing: 5

                        Text {
                            anchors.right: parent.right
                            text: carData.remainingKm + " km"
                            color: "#00BCD4"
                            font.pixelSize: 20
                            font.bold: true
                        }

                    }
                }
            }

            // 左侧水温条
            VerticalGauge {
                id: waterTempGauge
                anchors.right: rpmGauge.left
                anchors.rightMargin: 20
                anchors.verticalCenter: parent.verticalCenter
                width: 60
                height: 200
                visible: true

                minValue: 50
                maxValue: 130
                value: carData.waterTemp
                numTicks: 5

                unit: "°C"
                icon: "🌡️"

                warningZone: true
                warningThreshold: 110
            }

            // 右侧燃油条
            VerticalGauge {
                id: fuelGauge
                anchors.left: speedGauge.right
                anchors.leftMargin: 20
                anchors.verticalCenter: parent.verticalCenter
                width: 60
                height: 200
                visible: true

                minValue: 0
                maxValue: 100
                value: carData.fuelLevel


                unit: "%"
                icon: "⛽"

                warningZone: true
                warningThreshold: 20
                warningLow: true
            }
        }

        // 控制按钮区域
        Row {
            anchors.bottom: parent.bottom
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.bottomMargin: 20
            spacing: 20

            Button {
                text: carData.engineRunning ? "关闭发动机" : "启动发动机"
                onClicked: carData.toggleEngine()

                background: Rectangle {
                    radius: 20
                    color: carData.engineRunning ? "#f44336" : "#4CAF50"
                }

                contentItem: Text {
                    text: parent.text
                    color: "white"
                    font.pixelSize: 14
                    horizontalAlignment: Text.AlignHCenter
                    verticalAlignment: Text.AlignVCenter
                }
            }

            Button {
                text: carData.handbrakeOn ? "松开手刹" : "拉起手刹"
                onClicked: carData.toggleHandbrake()

                background: Rectangle {
                    radius: 20
                    color: carData.handbrakeOn ? "#f44336" : "#FFC107"
                }

                contentItem: Text {
                    text: parent.text
                    color: "white"
                    font.pixelSize: 14
                    horizontalAlignment: Text.AlignHCenter
                    verticalAlignment: Text.AlignVCenter
                }
            }

            Button {
                text: carData.headlightsOn ? "关闭大灯" : "打开大灯"
                onClicked: carData.toggleHeadlights()

                background: Rectangle {
                    radius: 20
                    color: carData.headlightsOn ? "#FFC107" : "#333"
                }

                contentItem: Text {
                    text: parent.text
                    color: "white"
                    font.pixelSize: 14
                    horizontalAlignment: Text.AlignHCenter
                    verticalAlignment: Text.AlignVCenter
                }
            }



            Button {
                text: "重置行程"
                onClicked: carData.resetTrip()

                background: Rectangle {
                    radius: 20
                    color: "#2196F3"
                }

                contentItem: Text {
                    text: parent.text
                    color: "white"
                    font.pixelSize: 14
                    horizontalAlignment: Text.AlignHCenter
                    verticalAlignment: Text.AlignVCenter
                }
            }
        }
    }

    // 详细信息视图
    DetailView {
        id: detailView
        visible: false
        anchors.fill: parent
    }
}
